to display a bullet in the icon-left or icon-right The following custom properties and mixins are available for styling: ### Custom properties | Custom Property | Selector | CSS Property | Value | | --cells-molecule-header-height | :host | height | rem(48px) | | --cells-molecule-header-color | :host | color | initial | | --cells-molecule-header-bg-color | :host | background-color | transparent | | --cells-molecule-header-news-icon-color | :host(.news) .left-icon::after, :host(.news) .right-icon::after | background | var(--bbva-dark-red, #B92A45) | ### @apply | Mixins | Selector | Value | |:--------------------------------------------------------------|:--------------------------------------------------------------| :-----| | --cells-molecule-header | :host | {} | | --cells-molecule-header-dark | :host(.header--dark) | {} | | --cells-molecule-header-medium | :host(.header--medim) | {} | | --cells-molecule-header-on-dark | :host(.header--on-dark) | {} | | --cells-molecule-header-light-grey | :host(.header--light-gray) | {} | | --cells-molecule-header-btn-transparent | .btn--transparent | {} | | --cells-molecule-header-btn-transparent-active | .btn--transparent:active | {} | | --cells-molecule-header-main-container | .main-container | {} | | --cells-molecule-header-main-container-title | .main-container .title | {} | | --cells-molecule-header-main-container-title-translate | .main-container .title.translate | {} | | --cells-molecule-header-main-container-title-header-title | .main-container .title .header-title | {} | | --cells-molecule-header-left-container | .left-container | {} | | --cells-molecule-header-left-container-left-icon | .left-container .left-icon | {} | | --cells-molecule-header-right-container | .right-container | {} | | --cells-molecule-header-right-container-button-settings | .right-container .button-settings | {} | | --cells-molecule-header-right-container-right-icon | .right-container .right-icon | {} | | --cells-molecule-header-right-container-right-icon-white | .right-container .right-icon .icon-white | {} | | --cells-molecule-header-right-container-right-icon-text | .right-container .right-icon .icon-text | {} | | --cells-molecule-header-right-container-right-icon-text-span | .right-container .right-icon .icon-text span | {} | | --cells-molecule-header-right-icon-text-main-container | :host([right-icon-text]) .main-container | {} | | --cells-molecule-header-right-icon-text-left-right-container | :host([right-icon-text]) .left-container and -right-container | {} | @demo demo/index.html -->